@import '../../styles/constants.scss';

.root {
	h1,
	h2,
	h3,
	p {
		margin: 0;
		padding: 0;
		border: 0;
		outline: 0;
		font-weight: inherit;
		font-style: inherit;
		font-size: 100%;
		font-family: inherit;
		vertical-align: baseline;
	}
}

.color_green {
	color: $color-ufo-green;
}

.color_pink {
	color: $color-candy-pink;
}

.color_yellow {
	color: $color-yellow-copacabana;
}

.color_blue {
	color: $color-ultramarine-blue;
}

.color_white {
	color: $color-white;
}

.color_gray {
	color: $color-blue-gray;
}

.color_platinum_gray {
	color: $color-platinum-gray;
}

.color_red {
	color: $color-fury-red;
}

.bold {
	font-weight: 600 !important;
}

.h1 {
	font-family: 'Poppins';
	font-size: 28px;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: 0;

	&.light {
		font-size: 26px;
		font-weight: 300;
	}
}

.h2 {
	font-family: 'Poppins';
	font-size: 20px;
	font-weight: 600;
	line-height: 1.3;
	letter-spacing: 0.2;
}

.h3 {
	font-family: 'Roboto';
	font-size: 16px;
	font-weight: 500;
	line-height: 1.2;
	letter-spacing: 0.2;
}

.th {
	font-family: 'Roboto';
	font-size: 14px;
	font-weight: 600;
	line-height: 1.2;
	letter-spacing: 0;
}

.tr {
	font-family: 'Roboto';
	font-size: 14px;
	font-weight: 400;
	line-height: 1.2;
	letter-spacing: 0;
}

.p {
	font-family: 'Poppins';
	font-size: 13px;
	font-weight: 400;
	line-height: 1.3;
	letter-spacing: 0;
	overflow-wrap: anywhere;
}
